/* AI医疗应用主题配色方案 */

:root {
  /* 主要颜色 - 蓝绿色系，代表医疗和科技 */
  --primary-color: #00a8cc;
  --primary-light: #4dd0e1;
  --primary-dark: #00838f;
  
  /* 次要颜色 - 紫色系，代表AI和智能 */
  --secondary-color: #7c4dff;
  --secondary-light: #b388ff;
  --secondary-dark: #6200ea;
  
  /* 成功颜色 - 绿色系，代表健康和活力 */
  --success-color: #00c853;
  --success-light: #69f0ae;
  --success-dark: #00b248;
  
  /* 警告颜色 - 橙色系，代表注意和提醒 */
  --warning-color: #ff9100;
  --warning-light: #ffab40;
  --warning-dark: #ff6d00;
  
  /* 危险颜色 - 红色系，代表警告和风险 */
  --danger-color: #ff5252;
  --danger-light: #ff8a80;
  --danger-dark: #ff1744;
  
  /* 信息颜色 - 青色系，代表信息和数据 */
  --info-color: #00b0ff;
  --info-light: #40c4ff;
  --info-dark: #0091ea;
  
  /* 中性颜色 */
  --white: #ffffff;
  --gray-50: #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;
  
  /* 文本颜色 */
  --text-primary: var(--gray-800);
  --text-secondary: var(--gray-600);
  --text-disabled: var(--gray-400);
  --text-inverse: var(--white);
  
  /* 背景颜色 */
  --bg-primary: var(--white);
  --bg-secondary: var(--gray-50);
  --bg-tertiary: var(--gray-100);
  
  /* 边框颜色 */
  --border-light: var(--gray-200);
  --border-medium: var(--gray-300);
  --border-dark: var(--gray-400);
  
  /* 阴影 */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  
  /* 渐变背景 */
  --gradient-primary: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
  --gradient-secondary: linear-gradient(135deg, var(--secondary-color), var(--secondary-dark));
  --gradient-success: linear-gradient(135deg, var(--success-color), var(--success-dark));
  --gradient-warning: linear-gradient(135deg, var(--warning-color), var(--warning-dark));
  --gradient-danger: linear-gradient(135deg, var(--danger-color), var(--danger-dark));
  --gradient-info: linear-gradient(135deg, var(--info-color), var(--info-dark));
  
  /* 特殊渐变 - 医疗主题 */
  --gradient-health: linear-gradient(135deg, #00a8cc, #7c4dff);
  --gradient-health-light: linear-gradient(135deg, #4dd0e1, #b388ff);
  --gradient-health-dark: linear-gradient(135deg, #00838f, #6200ea);
  
  /* AI主题渐变 */
  --gradient-ai: linear-gradient(135deg, #7c4dff, #00a8cc);
  --gradient-ai-light: linear-gradient(135deg, #b388ff, #4dd0e1);
  --gradient-ai-dark: linear-gradient(135deg, #6200ea, #00838f);
  
  /* 卡片渐变 */
  --gradient-card: linear-gradient(135deg, var(--white), var(--gray-50));
  --gradient-card-hover: linear-gradient(135deg, var(--white), var(--gray-100));
  
  /* 背景渐变 */
  --gradient-bg: linear-gradient(135deg, #f8fafc, #e2e8f0);
  --gradient-bg-dark: linear-gradient(135deg, #1e293b, #0f172a);
  
  /* 圆角 */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  
  /* 过渡动画 */
  --transition-fast: 0.15s ease-in-out;
  --transition-normal: 0.3s ease-in-out;
  --transition-slow: 0.5s ease-in-out;
}

/* 暗色主题变量 */
[data-theme="dark"] {
  /* 文本颜色 */
  --text-primary: var(--gray-100);
  --text-secondary: var(--gray-300);
  --text-disabled: var(--gray-500);
  
  /* 背景颜色 */
  --bg-primary: var(--gray-800);
  --bg-secondary: var(--gray-900);
  --bg-tertiary: var(--gray-700);
  
  /* 边框颜色 */
  --border-light: var(--gray-700);
  --border-medium: var(--gray-600);
  --border-dark: var(--gray-500);
  
  /* 背景渐变 */
  --gradient-bg: linear-gradient(135deg, #1e293b, #0f172a);
  --gradient-bg-dark: linear-gradient(135deg, #0f172a, #020617);
  
  /* 卡片渐变 */
  --gradient-card: linear-gradient(135deg, var(--gray-800), var(--gray-900));
  --gradient-card-hover: linear-gradient(135deg, var(--gray-700), var(--gray-800));
}

/* 主题类 */
.theme-primary {
  color: var(--primary-color);
  background: var(--gradient-primary);
}

.theme-secondary {
  color: var(--secondary-color);
  background: var(--gradient-secondary);
}

.theme-success {
  color: var(--success-color);
  background: var(--gradient-success);
}

.theme-warning {
  color: var(--warning-color);
  background: var(--gradient-warning);
}

.theme-danger {
  color: var(--danger-color);
  background: var(--gradient-danger);
}

.theme-info {
  color: var(--info-color);
  background: var(--gradient-info);
}

.theme-health {
  color: var(--white);
  background: var(--gradient-health);
}

.theme-ai {
  color: var(--white);
  background: var(--gradient-ai);
}

/* 文本颜色类 */
.text-primary {
  color: var(--text-primary);
}

.text-secondary {
  color: var(--text-secondary);
}

.text-disabled {
  color: var(--text-disabled);
}

.text-inverse {
  color: var(--text-inverse);
}

/* 背景颜色类 */
.bg-primary {
  background-color: var(--bg-primary);
}

.bg-secondary {
  background-color: var(--bg-secondary);
}

.bg-tertiary {
  background-color: var(--bg-tertiary);
}

/* 边框类 */
.border-light {
  border-color: var(--border-light);
}

.border-medium {
  border-color: var(--border-medium);
}

.border-dark {
  border-color: var(--border-dark);
}

/* 阴影类 */
.shadow-sm {
  box-shadow: var(--shadow-sm);
}

.shadow-md {
  box-shadow: var(--shadow-md);
}

.shadow-lg {
  box-shadow: var(--shadow-lg);
}

.shadow-xl {
  box-shadow: var(--shadow-xl);
}

/* 圆角类 */
.radius-sm {
  border-radius: var(--radius-sm);
}

.radius-md {
  border-radius: var(--radius-md);
}

.radius-lg {
  border-radius: var(--radius-lg);
}

.radius-xl {
  border-radius: var(--radius-xl);
}

.radius-full {
  border-radius: var(--radius-full);
}

/* 过渡类 */
.transition-fast {
  transition: all var(--transition-fast);
}

.transition-normal {
  transition: all var(--transition-normal);
}

.transition-slow {
  transition: all var(--transition-slow);
}